<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Sản phẩm</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="js/stepcarousel.js"></script>
<style type="text/css">
.stepcarousel{
position: relative; /*leave this value alone*/
border:0;
margin-top:0px;
overflow: hidden; /*leave this value alone*/
width: 894px; /*Width of Carousel Viewer itself*/
height: 250px; /*Height should enough to fit largest content's height*/
}
.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}
.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px; /*margin around each panel*/
width: 894px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}
</style>
<script type="text/javascript">

stepcarousel.setup({
	galleryid: 'mygallery', //id of carousel DIV
	beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
	panelclass: 'panel', //class of panel DIVs each holding content
	autostep: {enable:true, moveby:1, pause:3000},
	panelbehavior: {speed:200, wraparound:true , wrapbehavior:'slide', persist:true},
	defaultbuttons: {enable: true, moveby: 1, leftnav: ['images/img_slide/left.png', 0, 0], rightnav: ['images/img_slide/right.png', -28, 0]},
	statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
	contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file']
})
</script>
<link type="text/css" rel="stylesheet" href="css/style.css"/>
</head>

<body>
<center>
<div class="header">
    	<div class="logo"><img src="images/logo.png"/></div>
        <div class="menu">
    	<ul>
    	<li><a href="index.html">Trang chủ</a></li>
    	<li><a href="#">Sản phẩm</a></li>
    	<li><a href="#">Tin tức</a></li>
    	<li><a href="#">Liên hệ</a></li>
    	<li><a href="#">Hướng dẫn thanh toán</a></li>
    	</ul>
    	</div>
        <div class="dangnhap">
        	<a href="#">Đăng nhập</a> 
            <strong class="sep">/</strong>    
            <a href="#">Đăng xuất</a>
        </div>
        <a href="#" class="giohang"></a>
</div>

<div class="wapper">
<div class="slide">
	
	 <div id="mygallery" class="stepcarousel">
        <div class="belt">
          <div class="panel"><img src="images/img_slide/bt.jpg" /></div>
          <div class="panel"><img src="images/img_slide/bt2.jpg" /></div>
          <div class="panel"><img src="images/img_slide/rf1.jpg" /></div>
          <div class="panel"><img src="images/img_slide/rf2.jpg" /></div>
		  <div class="panel"><img src="images/img_slide/rf3.jpg" /></div>
		  <div class="panel"><img src="images/img_slide/rf5.jpg" /></div>
        </div>
      </div>
</div>  
      <p id="mygallery-paginate" style="width: 894px; text-align:center"> <img src="images/img_slide/2.png" data-over="images/img_slide/graycircle.png" data-select="images/img_slide/1.png" data-moveby="1" /> </p> 
<div class="menuleft">
	<div class="leftheader">
    	<img src="images/icon1.png" width="40" height="40"/>
        <font>Lựa chọn nhanh</font>
    </div> 
    <div class="danhmuc">
    	<ul>
        	<li><a href="#">Sách kỹ thuật</a></li>
            <li><a href="#">Sách kinh tế</a></li>
            <li><a href="#">Sách luật</a></li>
            <li><a href="#">Sách đại cương</a></li>
            <li><a href="#">Tài liệu tốt nghiệp</a></li>
            <li><a href="#">Tài liệu khác</a></li>
        </ul>
    </div>
</div>
	
<div class="content">
    	
    	<div class="content_top">
        </div>
        
        <div class="content_mid">
		<br />
				    <div class="searchchon">
    <select style="border:0px; width:180px; background-color:#fdfdfc" >
    	<option>Chọn trường</option>
    	<option>Đại học Xây dựng</option>
        <option>Đại học Bách khoa </option>
        <option>Đại học Ngoại thương </option>
        <option>Đại học Ngoại giao </option>
        <option>Đại học Kinh tế quốc dân </option>
        <option>Đại học Y Hà nội </option>
    </select>
    </div>
        <div class="content_search">
        	<div><font>Tìm kiếm</font></div>
    		<div class="textsearch">
            	<input type="text" name="txtsearch" style="border:0px; height:20px; padding:3px 0px; margin:2px; background-color:#f1f3f2" size="32px" />
            </div>
            <a href="#"><div class="btsearchsp"></div></a>
    	</div>

        	<div class="content_item">
            	<a href="chitietsp.html"><img src="images/images_book/sach1.jpg" />
                <font>Đọc vị bất kỳ ai</br>Tác giả: TS. David J. Lieberman</font></a></br>
                <font style="color:#000;">Giá: 40.000 đ</font> <a href="chitietsp.html"><img src="images/icon_DatHang.gif" style="width:45px; height:15px; float:right;" /></a>
            </div>
            <div class="content_item">
            	<a href="chitietsp.html"><img src="images/images_book/sach2.jpg" />
                <font>Đọc vị bất kỳ ai</br>Tác giả: TS. David J. Lieberman</font></a></br>
                <font style="color:#000;">Giá: 40.000 đ</font> <a href="chitietsp.html"><img src="images/icon_DatHang.gif" style="width:45px; height:15px; float:right;" /></a>
            </div>
            <div class="content_item">
            	<a href="chitietsp.html"><img src="images/images_book/sach3.jpg" />
                <font>Đọc vị bất kỳ ai</br>Tác giả: TS. David J. Lieberman</font></a></br>
                <font style="color:#000;">Giá: 40.000 đ</font> <a href="chitietsp.html"><img src="images/icon_DatHang.gif" style="width:45px; height:15px; float:right;" /></a>
            </div>
            <div class="content_item">
            	<a href="chitietsp.html"><img src="images/images_book/sach4.jpg" />
                <font>Đọc vị bất kỳ ai</br>Tác giả: TS. David J. Lieberman</font></a></br>
                <font style="color:#000;">Giá: 40.000 đ</font> <a href="chitietsp.html"><img src="images/icon_DatHang.gif" style="width:45px; height:15px; float:right;" /></a>
            </div>
            <div class="content_item">
            	<a href="chitietsp.html"><img src="images/images_book/sach5.jpg" />
                <font>Đọc vị bất kỳ ai</br>Tác giả: TS. David J. Lieberman</font></a></br>
                <font style="color:#000;">Giá: 40.000 đ</font> <a href="chitietsp.html"><img src="images/icon_DatHang.gif" style="width:45px; height:15px; float:right;" /></a>
            </div>
        </div>
    </div>
    
<div class="right">
	<div class="rightheader">
    	<img src="images/images_tintuc/icon_news.png" width="40" height="40"/>
        <font>Tin tức</font>
    </div> 
    <div class="tintuc">
    	<ul>
        	<li><a href="#">
            <img src="images/images_tintuc/miss5.jpg" />
            Sách kỹ thuật fjdlksfjalkdjflks  fjdksfjdskfjd  fjdsklfjdls djfljdskfjsdl fjdsklfjs fjdlksfjalkdjflks  fjdksfjdskfjd  fjdsklfjdls 
            </a></li>
            <li><a href="#">
            <img src="images/images_tintuc/miss4.jpg" />
            Sách kinh tế
            </a></li>
            <li><a href="#">
            <img src="images/images_tintuc/miss3.jpg" />
            Sách luật
            </a></li>
            <li><a href="#">
            <img src="images/images_tintuc/miss2.jpg" />
            Sách đại cương
            </a></li>
            <li><a href="#">
            <img src="images/images_tintuc/miss1.jpg" />
            Tài liệu tốt nghiệp
            </a></li>
            <li><a href="#">
            <img src="images/images_tintuc/miss6.jpg" />
            Tài liệu khác
            </a></li>
        </ul>
    </div>
</div>
<div class="logofooter">
    	<img src="images/logo_footer.png" />
    </div>
<div class="footer"></div>
</div> 

</center>
</body>
</html>
